const baogangTheme = {
  'color': [
    '#b2f144',
    '#2285d3',
    '#8660f3',
    '#f39460',
    '#cc6fe3',
    '#6b79e7',
    '#73a373',
    '#37ad4d',
    '#7289ab',
    '#91ca8c',
    '#f49f42'
  ],
  'backgroundColor': 'rgba(51,51,51,0)',
  'textStyle': {},
  'title': {
    'textStyle': {
      'color': '#21a6fb'
    },
    'subtextStyle': {
      'color': '#21a6fb'
    }
  },
  'line': {
    'itemStyle': {
      'normal': {
        'borderWidth': 3
      }
    },
    'lineStyle': {
      'normal': {
        'width': 1
      }
    },
    'symbolSize': 12,
    'symbol': 'emptyCircle',
    'smooth': false
  },
  'radar': {
    'itemStyle': {
      'normal': {
        'borderWidth': 1
      }
    },
    'lineStyle': {
      'normal': {
        'width': 2
      }
    },
    'symbolSize': 4,
    'symbol': 'circle',
    'smooth': false
  },
  'bar': {
    'itemStyle': {
      'normal': {
        'barBorderWidth': 0,
        'barBorderColor': '#ccc'
      },
      'emphasis': {
        'barBorderWidth': 0,
        'barBorderColor': '#ccc'
      }
    }
  },
  'pie': {
    'itemStyle': {
      'normal': {
        'borderWidth': 0,
        'borderColor': '#ccc'
      },
      'emphasis': {
        'borderWidth': 0,
        'borderColor': '#ccc'
      }
    }
  },
  'scatter': {
    'itemStyle': {
      'normal': {
        'borderWidth': 0,
        'borderColor': '#ccc'
      },
      'emphasis': {
        'borderWidth': 0,
        'borderColor': '#ccc'
      }
    }
  },
  'boxplot': {
    'itemStyle': {
      'normal': {
        'borderWidth': 0,
        'borderColor': '#ccc'
      },
      'emphasis': {
        'borderWidth': 0,
        'borderColor': '#ccc'
      }
    }
  },
  'parallel': {
    'itemStyle': {
      'normal': {
        'borderWidth': 0,
        'borderColor': '#ccc'
      },
      'emphasis': {
        'borderWidth': 0,
        'borderColor': '#ccc'
      }
    }
  },
  'sankey': {
    'itemStyle': {
      'normal': {
        'borderWidth': 0,
        'borderColor': '#ccc'
      },
      'emphasis': {
        'borderWidth': 0,
        'borderColor': '#ccc'
      }
    }
  },
  'funnel': {
    'itemStyle': {
      'normal': {
        'borderWidth': 0,
        'borderColor': '#ccc'
      },
      'emphasis': {
        'borderWidth': 0,
        'borderColor': '#ccc'
      }
    }
  },
  'gauge': {
    'itemStyle': {
      'normal': {
        'borderWidth': 0,
        'borderColor': '#ccc'
      },
      'emphasis': {
        'borderWidth': 0,
        'borderColor': '#ccc'
      }
    }
  },
  'candlestick': {
    'itemStyle': {
      'normal': {
        'color': '#fd1050',
        'color0': '#0cf49b',
        'borderColor': '#fd1050',
        'borderColor0': '#0cf49b',
        'borderWidth': 1
      }
    }
  },
  'graph': {
    'itemStyle': {
      'normal': {
        'borderWidth': 0,
        'borderColor': '#ccc'
      }
    },
    'lineStyle': {
      'normal': {
        'width': 1,
        'color': '#21a6fb'
      }
    },
    'symbolSize': 4,
    'symbol': 'circle',
    'smooth': false,
    'color': [
      '#dd6b66',
      '#759aa0',
      '#e69d87',
      '#8dc1a9',
      '#ea7e53',
      '#eedd78',
      '#73a373',
      '#73b9bc',
      '#7289ab',
      '#91ca8c',
      '#f49f42'
    ],
    'label': {
      'normal': {
        'textStyle': {
          'color': '#eeeeee'
        }
      }
    }
  },
  'map': {
    'itemStyle': {
      'normal': {
        'areaColor': '#eeeeee',
        'borderColor': '#444444',
        'borderWidth': 0.5
      },
      'emphasis': {
        'areaColor': 'rgba(255,215,0,0.8)',
        'borderColor': '#444444',
        'borderWidth': 1
      }
    },
    'label': {
      'normal': {
        'textStyle': {
          'color': '#000000'
        }
      },
      'emphasis': {
        'textStyle': {
          'color': 'rgb(100,0,0)'
        }
      }
    }
  },
  'geo': {
    'itemStyle': {
      'normal': {
        'areaColor': '#eeeeee',
        'borderColor': '#444444',
        'borderWidth': 0.5
      },
      'emphasis': {
        'areaColor': 'rgba(255,215,0,0.8)',
        'borderColor': '#444444',
        'borderWidth': 1
      }
    },
    'label': {
      'normal': {
        'textStyle': {
          'color': '#000000'
        }
      },
      'emphasis': {
        'textStyle': {
          'color': 'rgb(100,0,0)'
        }
      }
    }
  },
  'categoryAxis': {
    'axisLine': {
      'show': true,
      'lineStyle': {
        'color': '#666'
      }
    },
    'axisTick': {
      'show': true,
      'lineStyle': {
        'color': '#eeeeee'
      }
    },
    'axisLabel': {
      'show': true,
      'textStyle': {
        'color': '#bbb'
      }
    },
    'splitLine': {
      'show': true,
      'lineStyle': {
        'color': [
          '#333'
        ]
      }
    },
    'splitArea': {
      'show': false,
      'areaStyle': {
        'color': [
          '#eeeeee'
        ]
      }
    }
  },
  'valueAxis': {
    'axisLine': {
      'show': true,
      'lineStyle': {
        'color': '#fff'
      }
    },
    'axisTick': {
      'show': true,
      'lineStyle': {
        'color': '#21a6fb'
      }
    },
    'axisLabel': {
      'show': true,
      'textStyle': {
        'color': '#21a6fb'
      }
    },
    'splitLine': {
      'show': true,
      'lineStyle': {
        'color': [
          '#444'
        ]
      }
    },
    'splitArea': {
      'show': false,
      'areaStyle': {
        'color': [
          '#21a6fb'
        ]
      }
    }
  },
  'logAxis': {
    'axisLine': {
      'show': true,
      'lineStyle': {
        'color': '#21a6fb'
      }
    },
    'axisTick': {
      'show': true,
      'lineStyle': {
        'color': '#21a6fb'
      }
    },
    'axisLabel': {
      'show': true,
      'textStyle': {
        'color': '#21a6fb'
      }
    },
    'splitLine': {
      'show': true,
      'lineStyle': {
        'color': [
          '#21a6fb'
        ]
      }
    },
    'splitArea': {
      'show': false,
      'areaStyle': {
        'color': [
          '#21a6fb'
        ]
      }
    }
  },
  'timeAxis': {
    'axisLine': {
      'show': true,
      'lineStyle': {
        'color': '#21a6fb'
      }
    },
    'axisTick': {
      'show': true,
      'lineStyle': {
        'color': '#21a6fb'
      }
    },
    'axisLabel': {
      'show': true,
      'textStyle': {
        'color': '#21a6fb'
      }
    },
    'splitLine': {
      'show': true,
      'lineStyle': {
        'color': [
          '#21a6fb'
        ]
      }
    },
    'splitArea': {
      'show': false,
      'areaStyle': {
        'color': [
          '#21a6fb'
        ]
      }
    }
  },
  'toolbox': {
    'iconStyle': {
      'normal': {
        'borderColor': '#999999'
      },
      'emphasis': {
        'borderColor': '#666666'
      }
    }
  },
  'legend': {
    'textStyle': {
      'color': '#21a6fb'
    }
  },
  'tooltip': {
    'axisPointer': {
      'lineStyle': {
        'color': '#21a6fb',
        'width': '1'
      },
      'crossStyle': {
        'color': '#21a6fb',
        'width': '1'
      }
    }
  },
  'timeline': {
    'lineStyle': {
      'color': '#21a6fb',
      'width': 1
    },
    'itemStyle': {
      'normal': {
        'color': '#dd6b66',
        'borderWidth': 1
      },
      'emphasis': {
        'color': '#a9334c'
      }
    },
    'controlStyle': {
      'normal': {
        'color': '#21a6fb',
        'borderColor': '#21a6fb',
        'borderWidth': 0.5
      },
      'emphasis': {
        'color': '#21a6fb',
        'borderColor': '#21a6fb',
        'borderWidth': 0.5
      }
    },
    'checkpointStyle': {
      'color': '#e43c59',
      'borderColor': 'rgba(194,53,49,0.5)'
    },
    'label': {
      'normal': {
        'textStyle': {
          'color': '#21a6fb'
        }
      },
      'emphasis': {
        'textStyle': {
          'color': '#21a6fb'
        }
      }
    }
  },
  'visualMap': {
    'color': [
      '#bf444c',
      '#d88273',
      '#f6efa6'
    ]
  },
  'dataZoom': {
    'backgroundColor': 'rgba(47,69,84,0)',
    'dataBackgroundColor': 'rgba(255,255,255,0.3)',
    'fillerColor': 'rgba(167,183,204,0.4)',
    'handleColor': '#a7b7cc',
    'handleSize': '100%',
    'textStyle': {
      'color': '#21a6fb'
    }
  },
  'markPoint': {
    'label': {
      'normal': {
        'textStyle': {
          'color': '#21a6fb'
        }
      },
      'emphasis': {
        'textStyle': {
          'color': '#21a6fb'
        }
      }
    }
  }
};

const getEcharts = () => {
  let intervalID = null;
  return new Promise((resolve) => {
    if (window.echarts) {
      window.echarts.registerTheme('baogang', baogangTheme);
      resolve(window.echarts);
    } else {
      intervalID = setInterval(() => {
        if (window.echarts) {
          clearInterval(intervalID);
          window.echarts.registerTheme('baogang', baogangTheme);
          resolve(window.echarts);
        }
      }, 200);
    }
  });
};

export default {
  getEcharts
};
